<!doctype html>
<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta
    name="viewport"
    content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover"
  />
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="default" />
  <meta name="format-detection" content="telephone=no" />
  <meta name="referrer" content="no-referrer" />

  <title></title>
</head>

<body>
  <noscript>
    <strong>请开启浏览器的脚本支持！</strong>
  </noscript>

  <script>
    ;(function () {
      // https://stackoverflow.com/a/12625907
      // 后半句是为了排除老版 edge 浏览器
      var isWebkit = !!window.webkitURL && !window.MSStream
      if (!isWebkit) {
        var el = document.createElement('div')
        el.id = 'br-notice'
        el.innerHTML =
          '<span id="br-notice-close">✕</span><div class="hd"><h3>温馨提示</h3>非 Chrome 浏览器访问本站可能导致部分功能异常，推荐使用 Chrome 浏览器获得更佳的使用体验。</div><div class="ft"><a href="https://www.google.cn/intl/zh-CN/chrome/" id="br-notice-dl" target="_blank">立即下载</a><a id="br-notice-close-2">知道了</a></div>'
        document.body.appendChild(el)
        var close = function close() {
          document.body.removeChild(el)
        }
        document.getElementById('br-notice-dl').onclick = close
        document.getElementById('br-notice-close').onclick = close
        document.getElementById('br-notice-close-2').onclick = close
      }
    })()
  </script>
  <style>
    #br-notice {
      background-color: #fff;
      border-radius: 4px;
      box-shadow: 0px 2px 8px 0px #ddd;
      height: 218px;
      left: 50%;
      margin-left: -210px;
      position: fixed;
      top: 35%;
      width: 470px;
      z-index: 99999;
    }
    #br-notice * {
      box-sizing: border-box;
    }
    #br-notice-close {
      color: #979fae;
      cursor: pointer;
      font-size: 14px;
      padding: 3px;
      position: absolute;
      right: 10px;
      top: 10px;
    }
    #br-notice .hd {
      background-image: url('/browser-support/bg.png');
      background-size: 470px 150px;
      color: #2b3959;
      font-size: 15px;
      height: 150px;
      line-height: 1.5715;
      padding: 24px 55px 0 133px;
    }
    #br-notice h3 {
      color: #1b2740;
      font-size: 20px;
      margin-top: 0;
      margin-bottom: 2px;
    }
    #br-notice .ft {
      padding-top: 16px;
      text-align: center;
      font-size: 15px;
    }
    #br-notice-dl {
      background-image: url('/browser-support/chrome.png');
      background-position: 12px center;
      background-repeat: no-repeat;
      background-size: 18px 18px;
      border-radius: 3px;
      border: 1px solid #1890ff;
      color: #1890ff;
      display: inline-block;
      margin-right: 18px;
      padding: 6px 12px 6px 36px;
      text-decoration: none;
    }
    #br-notice-dl:hover {
      opacity: 0.8;
    }
    #br-notice-close-2 {
      border-radius: 3px;
      border: 1px solid #dddfe3;
      color: #2b3959;
      display: inline-block;
      padding: 6px 14px 6px 16px;
    }
    #br-notice-close-2:hover {
      opacity: 0.8;
      cursor: pointer;
    }
  </style>
</body>

<script src="./desktop/index.tsx" type="module"></script>
